<route lang="json5">
{
  style: {
    navigationBarTitleText: '活动评分考核',
  },
}
</route>

<template>
  <view class="common-container">
    <view class="common-info">
      <view class="common-info-title">现场媒资</view>
      <view class="common-info-content">
        <wd-img
          custom-class="media-img"
          v-for="item in formattedLiveUrl"
          :key="item"
          :width="100"
          :height="100"
          :src="item"
          :enable-preview="true"
        />
      </view>
    </view>
    <view class="common-info">
      <view class="common-info-title">活动信息</view>
      <view class="common-info-content">
        <view class="common-info-item">活动名称：{{ detailData.name }}</view>
        <view class="common-info-item">活动日期：{{ detailData.date }}</view>
        <view class="common-info-item">所属礼堂：{{ detailData.hallId_dictText }}</view>
        <view class="common-info-item">活动类型：{{ detailData.type_dictText }}</view>
      </view>
    </view>
    <view class="common-info">
      <view class="common-info-title">审核</view>
      <view class="common-info-content">
        <wd-form custom-class="common-form" ref="formRef" :model="formModel">
          <wd-cell-group>
            <wd-picker
              :columns="columns"
              label="活动规模"
              v-model="formModel.scaleScore"
              required
              @confirm="handleConfirm"
            />
            <wd-picker
              :columns="columns"
              label="活动新颖性"
              v-model="formModel.innovationScore"
              required
              @confirm="handleConfirm"
            />
            <wd-picker
              :columns="columns"
              label="执行效率"
              v-model="formModel.efficiencyScore"
              required
              @confirm="handleConfirm"
            />
            <wd-picker
              :columns="columns"
              label="活动意义"
              v-model="formModel.meaningScore"
              required
              @confirm="handleConfirm"
            />
            <wd-cell title="综合评价" required>
              <wd-textarea v-model="formModel.note" auto-height placeholder="请输入" />
            </wd-cell>
          </wd-cell-group>
        </wd-form>
        <wd-button type="primary" @click="submitForm" :round="false" block>提交</wd-button>
      </view>
    </view>
  </view>
</template>

<script setup>
import ActivityApi from '@/service/activity'
import { uniNavigateTo, formatUrlString, returnStatusColor } from '@/utils'

const columns = [
  { label: '5分', value: '5' },
  { label: '10分', value: '10' },
  { label: '15分', value: '15' },
  { label: '20分', value: '20' },
  { label: '25分', value: '25' },
]

const formRef = ref()
const formModel = ref({
  scaleScore: '',
  innovationScore: '',
  efficiencyScore: '',
  meaningScore: '',
  note: '',
})
const formKeyMap = {
  scaleScore: '活动规模',
  innovationScore: '活动新颖性',
  efficiencyScore: '执行效率',
  meaningScore: '活动意义',
  note: '综合评价',
}

const detailData = ref({
  userId_dictText: '',
  hallId_dictText: '',
  year: '',
  quarter: '',
  targetNum: '',
  actualNum: '',
})

const formattedLiveUrl = computed(() => {
  return formatUrlString(detailData.value.liveUrl, false)
})

const getDetail = async (id) => {
  const params = { id }
  const { code, result } = await ActivityApi.getActivityMarkDetail(params)
  if (code === 200 && result) {
    detailData.value = { ...result }
  }
}

const submitForm = () => {
  let objKey = ''
  for (const key in formKeyMap) {
    if (!formModel.value[key]) {
      objKey = key
      break
    }
  }
  if (objKey) {
    uni.showToast({
      title: `${formKeyMap[objKey]}不能为空`,
      icon: 'none',
    })
    return false
  }

  formRef.value
    .validate()
    .then(async () => {
      const params = {
        ...formModel.value,
        activityId: activityId.value,
      }
      const { code, result, message } = await ActivityApi.submitActivityMark(params)
      if (code === 200 && result) {
        uni.showToast({
          icon: 'success',
          title: '提交成功',
        })
        setTimeout(() => {
          // isNavigateBack.value = true
          // uni.navigateBack()
          goBack()
        }, 1000)
      } else {
        uni.showToast({
          icon: 'error',
          title: message,
        })
      }
    })
    .catch((error) => {
      console.error(error)
    })
}

/**
 * 如果需要操作完，立马返回上一页，执行更新操作
 */
const goBack = () => {
  const pages = getCurrentPages()
  const prevPage = pages[pages.length - 2]

  uni.navigateBack({
    delta: 1,
    success: () => {
      prevPage.$vm?.updateList()
    },
  })
}

const activityId = ref('')
onLoad((options) => {
  if (options.id) {
    activityId.value = options.id
    getDetail(options.id)
  }
})
</script>

<script>
export default {
  options: {
    styleIsolation: 'shared',
  },
}
</script>

<style lang="scss">
@import '../../../style/common-form';

.common-info {
  padding-bottom: $uni-spacing-col-lg;

  &-title {
    padding-bottom: $uni-spacing-col-base;
    margin-bottom: $uni-spacing-col-base;
    font-size: $uni-font-size-lg;
    font-weight: 600;
    border-bottom: 1px solid $uni-border-color;
  }

  &-item {
    margin-bottom: $uni-spacing-col-sm;
  }

  &-content {
    :deep() .media-img {
      margin-right: $uni-spacing-row-sm;
      margin-bottom: $uni-spacing-col-sm;
    }
  }
}
</style>
